{include file="header.html"}
<body class="gr">

<div class="navBar">
	<a class="left" href="javascript:history.back()"><i class="return"></i></a>
	<div class="titleView-x">社保计算器</div>
</div>

<div class="home-casy cart-casy main-top">
	<div class="view">
		<div class="title ge-bottom">选择城市</div>
		<div class="select-view">
			<a href="?app=cart&act=province" class="placeholder">请选择城市</a>
			<input type="hidden" id="province_id" name="province_id" />
			<input type="hidden" id="city_id" name="city_id" />
		</div>
		
		<div class="ge-top"></div>
		<div class="title ge-bottom">社保</div>
		<div class="select-view">
			<select name="casy_id" id="casy_id" class="">
			<option value="">请选择险种类型</option>
			</select>
		</div>
		<div class="input-view">
			<div class="btn">最低基数</div>
			<span id="casy_money">填写基数</span>
		</div>

		<div class="ge-top"></div>
		<div class="title ge-bottom">公积金</div>
		<div class="text-view gjj">
			<div class="text"><span>公司</span>0.00%</div>
			<div class="text"><span>个人</span>0.00%</div>
		</div>
		<div class="input-view gjj-view">
			<div class="btn">最低基数</div>
			<input type="tel" id="gjj" placeholder="填写基数" disabled />
		</div>
	</div>

	<div class="buttonView">
		<a href="javascript:void(0)" class="reset">重置</a>
		<a href="wap.php?app=home&act=casy_detail">计算</a>
	</div>
</div>

{include file="footer.html"}
<script>
$(function(){
	bodyView.find('#casy_id').change(function(){
		bodyView.find('#casy_money').val($(this).selected().attr('money')).prev().addClass('btn-x');
	});
	bodyView.find('.reset').click(function(){
		bodyView.find('form')[0].reset();
		bodyView.find('#province_id').val('');
		bodyView.find('#city_id').val('');
		bodyView.find('.select-view a').html('请选择城市').addClass('placeholder');
		bodyView.find('#casy_id').html('<option value="">请选择险种类型</option>');
		bodyView.find('.gjj .text:eq(0)').html('<span>公司</span>0.00%');
		bodyView.find('.gjj .text:eq(1)').html('<span>个人</span>0.00%');
		bodyView.find('.btn-x').removeClass('btn-x');
		bodyView.find('.buttonView .btn').removeClass('btn');
	});
	$(document.body).on('click', '.home-casy .btn', function(){
		if(!$('#province_id').val().length || !$('#city_id').val().length){
			$.overloadError('请选择城市');
			return;
		}
		if(!$('#casy_id').selected().val().length){
			$.overloadError('请选择险种类型');
			return;
		}
		bodyView.find('form').submit();
	});
	
	//参保地
	pushBodyView(bodyView.find('.select-view a'), function(bodyView, link, delegate){
		function search(){
			var keyword = bodyView.find('#keyword').val();
			if(!keyword.length){
				bodyView.find('.view:not(.search) a').show();
			}else{
				bodyView.find('.view:not(.search) a').each(function(){
					if($(this).text().indexOf(keyword)>-1)$(this).show();
					else $(this).hide();
				});
			}
			bodyView.find('.view:not(.search) a').addClass('ge-bottom').filter(':visible:last').removeClass('ge-bottom');
		}
		bodyView.find('.search a').click(function(){
			search();
		});
		bodyView.find('.search input').onkey(function(code){
			if(code==13)search();
		});
		bodyView.find('.view:not(.search) a:visible:last').removeClass('ge-bottom');
		pushBodyView('.cart-province .view:not(.search) a', function(bodyView){
			function search(){
				var keyword = bodyView.find('#keyword').val();
				if(!keyword.length){
					bodyView.find('.view:not(.search) a').show();
				}else{
					bodyView.find('.view:not(.search) a').each(function(){
						if($(this).text().indexOf(keyword)>-1)$(this).show();
						else $(this).hide();
					});
				}
				bodyView.find('.view:not(.search) a').addClass('ge-bottom').filter(':visible:last').removeClass('ge-bottom');
			}
			bodyView.find('.search a').click(function(){
				search();
			});
			bodyView.find('.search input').onkey(function(code){
				if(code==13)search();
			});
			bodyView.find('.view:not(.search) a:visible:last').removeClass('ge-bottom');
			bodyView.find('.view:not(.search) a').click(function(){
				delegate.find('#province_id').val($(this).attr('province-id'));
				delegate.find('#city_id').val($(this).attr('city-id'));
				link.removeClass('placeholder').html($(this).attr('name'));
				$.getJSON('api.php?app=home&act=get_casy&city_id='+$(this).attr('city-id'), function(json){
					if(json.error!=0){ $.overloadError(json.msg);return }
					var html = '';
					$.each(json.data.casy, function(){
						html += '<option value="'+this.id+'" money="'+this.money+'">'+this.name+'</option>';
					});
					delegate.find('#casy_id').html(html).change();
					delegate.find('.gjj .text:eq(0)').html('<span>公司</span>'+json.data.row.firm+'%');
					delegate.find('.gjj .text:eq(1)').html('<span>个人</span>'+json.data.row.person+'%');
					delegate.find('#gjj_money').val(json.data.row.money).prev().addClass('btn-x');
					delegate.find('.home-casy .buttonView a:eq(1)').addClass('btn');
				});
			});
		});
	});
});
</script>